<template>
  <div class="cost-summary">
    <ProTable
      ref="revenue_table"
      :immediate="false"
      :search-form="formList"
      :columns="columns"
      :request="getCostSummary"
      :before-search-submit="beforeSearchSubmit"
    >
      <template #extra>

        <Authc permissions="trade:settlement:report:revenueCostSummary:export">
          <Button type="primary" @click="exportExcel">导出当前页</Button>
        </Authc>
      </template>
    </ProTable>
  </div>
</template>

<script>
import { omit } from 'lodash'
import ProTable from '@/components/ProTable';
import { getCostSummary,getRevenueType,getOrderDictionary,getMerchantAllMerchant,getMerchantAllOrg,exportRevenueSummary
} from '@/api/statement';
import { getDateRangeDate } from '@/utils/date'
import util from '@/utils/util'
import Authc from "@/components/Authc";
export default {
  name: 'RevenueCostSummary',
  components: {
    ProTable,
    Authc
  },
  data() {
    return {
      revenueTypeList:[],//收入确认类型列表
      formList: [
        {
          type: 'range',
          name: 'date',
          label: '统计周期',
          value: '',
          props: {
            placeholder: '请选择',
            format: 'yyyy年MM月dd日'
          }
        },
        {
          type: 'select',
          name: 'orderSource',
          label: '场景',
          value: '',
          props: {
            placeholder: '请选择',
            optionList: [],
            clearable:false
          }
        },
        {
          type: 'select',
          name: 'revenueType',
          label: '收入确认类型',
          value: '',
          props: {
            placeholder: '请选择',
            optionList: []
          }
        },
        {
          type: 'select',
          name: 'orgCode',
          label: '组织机构',
          value: '',
          props: {
            placeholder: '请选择',
            optionList: [],
            clearable:false
          }
        },
        {
          type: 'select',
          name: 'merchantCode',
          label: '商户名称',
          value: '',
          props: {
            placeholder: '请选择',
            optionList: [],
            clearable:false
          }
        }
      ],
      columns: [
        {
          title: '收入确认类型',
          key: 'revenueTypeName',
          align: 'center',
        },
        {
          title: '销售金额',
          key: 'subOrderAmountTotal',
          align: 'center',
          render: (h, params) => {
            let item = params.row.subOrderAmountTotal / 100;
            return h('span', util.toMoney(item))
          }
        },
        {
          title: '优惠金额',
          key: 'discountTotal',
          align: 'center',
          render: (h, params) => {
            let item = params.row.discountTotal / 100;
            return h('span', util.toMoney(item))
          }
        },
        {
          title: '结算金额',
          key: 'productCostTotal',
          align: 'center',
          render: (h, params) => {
            let item = params.row.productCostTotal / 100;
            return h('span', util.toMoney(item))
          }
        },
        {
          title: '收入',
          key: 'revenueAmountTotal',
          align: 'center',
          render: (h, params) => {
            let item = params.row.revenueAmountTotal / 100;
            return h('span', util.toMoney(item))
          }
        },
        {
          title: '服务成功笔数',
          key: 'scOrderCount',
          align: 'center',
        }
      ]
    };
  },
  created() {
    this.initSearchValue()
  },
  methods: {
    getCostSummary,
    beforeSearchSubmit(data) {
      return omit(data, this.searchDateHandler(data))
    },
    searchDateHandler(data){
      const { date } = data

      const [startDate, endDate] = getDateRangeDate(date)
      if(startDate){
        data.startDate = util.formatDate(startDate)
      }
      if(endDate){
        data.endDate = util.formatDate(endDate)
      }

      return data
    },
    async exportExcel() {
      let data=this.$refs['revenue_table'].getSearchParams()
      const {date} =data
      if(!date || date[0]===''){
        this.$Message.error('请选择查询条件~');
        return
      }
      data=this.searchDateHandler(data)
      const res = await exportRevenueSummary(data);
      if (res) {
        util.exportExcle(res, `${data.startDate}至${data.endDate}收入成本汇总`);
      }
    },
    async getRevenueTypeList(){
      const res=await getRevenueType();
      const selectRevenueTypeList = res.map(({revenueType, revenueTypeName}) => {
        return {
          value: revenueType,
          label: revenueTypeName
        };
      });
      this.setSearchOptionListInitValue("revenueType",selectRevenueTypeList)
    },
    async initSearchValue(){
      this.getRevenueTypeList()
      const orderSourceList=await getOrderDictionary("orderSource")
      const selectRevenueTypeList = orderSourceList.map(({value, key}) => {
        return {
          value: key,
          label: value
        };
      });
      this.setSearchOptionListInitValue("orderSource",selectRevenueTypeList)

      // 查询商户
      const merchantList=await getMerchantAllMerchant();
      const selectMerchantList = merchantList.map(({merchantCode, merchantName}) => {
        return {
          value: merchantCode,
          label: merchantName
        };
      });
      this.setSearchOptionListInitValue("merchantCode",selectMerchantList)

      // 查询机构
      const orgList=await getMerchantAllOrg();
      const selectOrgList = orgList.map(({organizationCode, organizationName}) => {
        return {
          value: organizationCode,
          label: organizationName
        };
      });
      this.setSearchOptionListInitValue("orgCode",selectOrgList)
    },
    setSearchOptionListInitValue(name,value){
      this.formList.map(item=>{
        if(item.name===name && item.props){
          item.props.optionList=value
        }
      })
    }
  }
};
</script>
